<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>大货标签打印</title>
<!-- <link href="__TPL_CSS__/print_lable.css?v-1.0.0" rel="stylesheet" type="text/css"/> -->
<script src="__JS__/jquery.1.7.2.js" /></script>
</head>

<body>
<div class="print_but">
  <p><input type="checkbox" id="sync" checked="checked">同步修改</p>
  <p class="tips">勾选同步功能后，同款编号同个色号数据修改会被同步，取消勾选后不同步</p>
  <!-- <p><input type="text" class="input" id="title" value="{$title}"/></p> -->
  <p><a href="javascript:prnt_preview()">打印标签</a></p>
</div>

<div class="print-page" id="printDiv">
  <div class="orderprint">
	  <style>
		  @charset "utf-8";body {color: #000;padding: 0px;margin: 0px;background: #EEE;}html,body{height: 100%;}div{padding: 0px;margin: 0px;}a:focus, a:active {text-decoration: none;}a {color: #0579C6;text-decoration: none;-webkit-transition-property: color;-webkit-transition-duration: 0.3s;-webkit-transition-timing-function: ease;}a:hover {color: #fff;}.hidden {display: none;}.center {text-align: center;}.position-relative {position: relative;}.position-absolute {position: absolute;}.wrapper {width: 1200px;margin: auto;}.orderprint {font-weight: bold;height: 100%;padding: 0mm;margin:auto;margin-top:10mm;margin-bottom:10mm;color: #000000;}.labelbox{background: #FFF;text-align:center;width: 100mm;height: 100mm;margin:0mm;border:none;}.labelbox input[type=text]{height: 100%;width: 100%;font-size: 16px;font-weight: bold;text-align: center;border:none;}.labelbox .top{display: flex;justify-content:space-between;align-items: center;height: 20mm;width: 80mm !important;margin: 0px auto;padding: 2mm 10mm 1mm 10mm;}.labelbox .top div{float: left;}.labelbox .top .logo{font-size: 14mm;height: 20mm;display: flex;align-items: center;}.labelbox .top .logo img{width: 60mm;height: 18mm;}.labelbox .top .qrimg{width: 20mm;height: 20mm;}.labelbox .top .qrimg img{width: 100%;height: 100%;}.labelbox .foot{text-indent: 2em;font-size: 14px;margin: 2mm auto;text-align:left;width: 80mm;}.labelbox .pro-info{margin:auto;width: 80mm;}.labelbox .pro-info td{height: 8mm;text-align: center;border:1px solid #000;}.labelbox .pro-info .lf{text-align: left;}.labelbox .pro-info tfoot td{border-bottom: none;border-left: none;border-right: none;}.orderprint table {font-family: Arial, Helvetica, sans-serif;font-size: 16 px;line-height: 18px;width: 100%;border-collapse: collapse;}.orderprint th {font-variant: normal;text-align: left }.w200 {width: 200px !important;}.w240 {width: 240px !important;}.tl {text-align: left !important;}.w70 {width: 70px !important;}.w40 {width: 40px !important;}.print_but{position:fixed;top:0px;right: 0px;height: 100%;width: 180px;text-align: center;margin:auto;padding-top: 150px;border-left:#DDD 1px solid;background:#F6F6F6;}.print_but a{color:#FFF;padding: 5px 10px;font-size: 12px;line-height: 1.5;border-radius: 3px;display: inline-block;padding: 6px 12px;margin-bottom: 0;font-size: 18px;font-weight: 400;line-height: 1.42857143;text-align: center;white-space: nowrap;vertical-align: middle;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-image: none;border: 1px solid transparent;border-radius: 4px;background-color: #00A5E0;border-color: #00A5E0;}.print_but input[type=checkbox]{padding: 5px;border:1px solid #CCC;}.print_but .tips{text-align: left;margin: 5px auto;font-size: 12px;width: 120px;color: #999;}#printDiv .orderprint,#printDiv .orderprint .top{width: 100mm;}.input{text-align: center;width: 80%;height: 38px;line-height: 1.3;line-height: 38px\9;border-width: 1px;border-style: solid;border-color: #ced4da;background-color: #fff;color: rgba(0,0,0,.85);border-radius: 10px;}
	 </style>
      {volist name="Tinfo" id="v"}
        {volist name="v.weight" id="v2"}
        {if $v2 neq ''}
          {php}$count++{/php}
          <div class="labelbox">
            <div class="top">
              <div class="logo" style="font-size: {$fontsize}mm;width:{$title_width}mm">{$title}</div>
			  {if $qr_type!=0}
              <div class="qrimg"><img src="{:U('Result/rqcode',['str'=>$qrcode,'d'=>0,'pass'=>64],true,'api')}"/></div>
			  {/if}
            </div>
            <table class="pro-info">
              <tbody>
                    <tr>
                        <td width="15%">编号</td>
                        <td colspan="3" width="85%"><input type="text" name="{$v.number}{$v.color}_id" value="{$v.number}"/></td>
                    </tr>
                    <tr>
                        <td width="15%">品名</td>
                        <td colspan="3" width="85%"><input type="text" name="{$v.number}{$v.color}_name" value="{$v.name}"/></td>
                    </tr>
                    <tr>
                        <td width="15%">幅宽</td>
                        <td width="32%"><input type="text" name="{$v.number}{$v.color}_breadth" value="{$v.breadth}cm {$v.side_type}"/></td>
                        <td width="15%">克重</td>
                        <td width="38%"><input type="text" name="{$v.number}{$v.color}_square" value="{$v.square}G 回缩"/></td>
                    </tr>
                    <tr>
                        <td width="15%">色号</td>
                        <td width="32%"><input type="text" name="{$v.number}{$v.color}_color" value="{$v.color} #"/></td>
                        <td width="15%">颜色</td>
                        <td width="38%"><input type="text" name="{$v.number}{$v.color}_colorname" value="{$v.colorname}"/></td>
                    </tr>
                    <tr>
                        <td width="15%">重量</td>
                        <td colspan="3" width="85%"><input type="text" value="{$v2} KG （毛重）"/></td>
                    </tr>
                    <tr>
                        <td width="15%">缸号</td>
                        <td colspan="3" width="85%"><input type="text" name="{$v.number}{$v.color}_bacth" value="{$v.bacth}"/></td>
                    </tr>
                    <tr>
                        <td width="15%">备注</td>
                        <td colspan="3" width="85%"><input type="text" name="{$v.number}{$v.color}_remark" value=""/></td>
                    </tr>
                </tbody>
            </table>
            <div class="foot">{$tips}</div>
          </div>
        {/if}
        {/volist}
      {/volist}
  </div>
</div>

<script type="text/javascript" src="__TOOL__/print/LodopFuncs.js?v-6.577" charset="utf-8"></script>
<object  id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0> 
       <embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0></embed>
</object>
<script>
var print_id='printDiv';
setTimeout("CheckIsInstall()","1000");
function CheckIsInstall() {  
    try{ 
        var LODOP=getLodop(); 
        if (LODOP.VERSION) {
           if (LODOP.CVERSION){
           //alert("当前有C-Lodop云打印可用!\n C-Lodop版本:"+LODOP.CVERSION+"(内含Lodop"+LODOP.VERSION+")"); 
           }else{
           //alert("本机已成功安装了Lodop控件！\n 版本号:"+LODOP.VERSION); 
           }
        };
       }catch(err){ 
     }
  }; 

//动态绑定VAL的值
$(document).ready(function(){
  $(".pro-info input").change(function(){
    if($('#sync').is(':checked')){
      var name=$(this).attr('name');
      var val=$(this).val();
	  if(name!=undefined){
		$('[name="'+name+'"]').attr('value',val);  
	  }
    }else{
      $(this).attr('value',$(this).val());
    }
  });
  
  $("#title").change(function(){
	  let val=$(this).val();
	  $(".logo").html(val);
  });
  
  /*$(window).bind('beforeunload', function () {
  });*/

})

var LODOP; //声明为全局变量 
function getid(id){
  return document.getElementById(id);
}
function prnt_preview() { 
  CreateOneFormPage();  
  LODOP.PREVIEW();  
};
function CreateOneFormPage(){
  // var cssStyle='<link href="__TPL_CSS__/print_lable.css?v-1.0.0" rel="stylesheet" type="text/css"/>';
  var cssStyle='';
  var printArea=getid(print_id).innerHTML;
  printArea=cssStyle+'<body>'+printArea+'</body>';

  LODOP=getLodop();  
  LODOP.PRINT_INIT();
  LODOP.SET_PRINT_STYLEA(1,"Horient",3);
  LODOP.SET_PRINT_PAGESIZE(1,'100mm','100mm','CreateCustomPage');
  LODOP.SET_PRINT_STYLE("FontSize",14);
  LODOP.SET_PRINT_MODE("POS_BASEON_PAPER",true);
  LODOP.SET_PRINTER_INDEX('{$print_name}');       //设置默认打印机
  LODOP.SET_PREVIEW_WINDOW(0,0,0,800,600,"");         //自定义窗口
  LODOP.SET_PRINT_MODE ("PRINT_END_PAGE",{$count});         //设置从第-1页结束打印
  LODOP.ADD_PRINT_HTM(0,0,'100mm','100mm',printArea);
};

</script>
</body>
</html>